<template>
  <main>
    <section v-for="(item, index) in page" :key="index">
      <main-swipe v-if="item.type === 'swipe'" :value="item.value"></main-swipe>

      <main-sort v-else-if="item.type === 'sort'" :value="item.value"></main-sort>

      <main-stall v-else-if="item.type === 'stall'" :value="item.value"></main-stall>

      <main-floor v-else-if="item.type === 'floor'" :value="item.value" :billboard="item.billboard"></main-floor>
    </section>
  </main>
</template>

<script>
import MainSwipe from './main-swipe'
import MainSort from './main-sort'
import MainStall from './main-stall'
import MainFloor from './main-floor'
export default {
  components: {
    MainSwipe,
    MainSort,
    MainStall,
    MainFloor
  },
  data () {
    return {
      page: []
    }
  },
  methods: {
    mockSwipe () {
      let page = this.page
      let i = 5
      let tmp = []
      while (i > 0) {
        tmp.push({
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        })
        i--
      }
      page.push({
        type: 'swipe',
        value: tmp
      })
    },
    mockSort () {
      let page = this.page
      let i = 0
      let tmp = []
      while (i < 10) {
        tmp.push({
          src: this.$utils.randomEnum(this.$store.state.image),
          sortId: i,
          name: '分类' + i
        })
        i++
      }
      page.push({
        type: 'sort',
        value: tmp
      })
    },
    mockStall (id) {
      let page = this.page
      const tmp1 = [
        {
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        },
        {
          children: [
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            },
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            }
          ]
        }
      ]
      const tmp2 = [
        {
          children: [
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            },
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            }
          ]
        },
        {
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        }
      ]
      const tmp3 = [
        {
          children: [
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            },
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            }
          ]
        },
        {
          children: [
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            },
            {
              src: this.$utils.randomEnum(this.$store.state.image),
              path: '/'
            }
          ]
        }
      ]
      const tmp4 = [
        {
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        },
        {
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        }
      ]
      const tmp5 = [
        {
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        }
      ]
      switch (id) {
        case 1:
          page.push({
            type: 'stall',
            value: tmp1
          })
          break
        case 2:
          page.push({
            type: 'stall',
            value: tmp2
          })
          break
        case 3:
          page.push({
            type: 'stall',
            value: tmp3
          })
          break
        case 4:
          page.push({
            type: 'stall',
            value: tmp4
          })
          break
        case 5:
          page.push({
            type: 'stall',
            value: tmp5
          })
          break
        default:
          page.push({
            type: 'stall',
            value: tmp1
          })
          break
      }
    },
    mockFloor () {
      let page = this.page
      let i = 10
      let tmp = []
      while (i > 0) {
        tmp.push({
          sku: {
            tree: [
              {
                k: '颜色',
                v: [
                  {
                    id: this.$utils.randomNumber(10000, 99999),
                    name: '红色' + i,
                    imgUrl: this.$utils.randomEnum(this.$store.state.image)
                  },
                  {
                    id: this.$utils.randomNumber(10000, 99999),
                    name: '蓝色' + i,
                    imgUrl: this.$utils.randomEnum(this.$store.state.image)
                  },
                  {
                    id: this.$utils.randomNumber(10000, 99999),
                    name: '绿色' + i,
                    imgUrl: this.$utils.randomEnum(this.$store.state.image)
                  }
                ],
                k_s: 's1'
              }
            ],
            list: [
              {
                id: 2259,
                price: this.$utils.randomNumber(1000, 5000),
                s1: '1215',
                s2: '1193',
                s3: '0',
                stock_num: 110
              }
            ],
            price: this.$utils.randomNumber(1000, 5000),
            stock_num: this.$utils.randomNumber(1000, 2000),
            collection_id: 2261,
            none_sku: !(i % 2)
          },
          goods: {
            title: '商品名称' + i,
            picture: this.$utils.randomEnum(this.$store.state.image)
          }
        })
        i--
      }
      page.push({
        type: 'floor',
        billboard: {
          src: this.$utils.randomEnum(this.$store.state.image),
          path: '/'
        },
        value: tmp
      })
    },
    async getPage () {
      await this.mockSwipe()
      await this.mockSort()
      await this.mockStall(1)
      await this.mockStall(2)
      await this.mockStall(3)
      await this.mockStall(4)
      await this.mockStall(5)
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
      await this.mockFloor()
    }
  },
  created () {
    this.getPage()
  }
}
</script>
